<template>
    <div class="app-container">
        <header>
            <div>
                <el-form :model="form" label-width="90px" inline size="small">
                    <el-form-item label-width="60px" label="车牌号">
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                    <el-form-item label-width="120px" label="车架号">
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                    <el-form-item label="是否报废" label-width="120px">
                        <el-select v-model="form.region" placeholder="请选择活动区域">
                            <el-option label="区域一" value="shanghai"></el-option>
                            <el-option label="区域二" value="beijing"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="备注" label-width="120px">
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                    <el-form-item label=" ">
                        <el-button type="primary" icon="el-icon-search">查询</el-button>
                        <el-button type="primary" icon="el-icon-plus">新增</el-button>
                        <el-button type="info" plain>清空条件</el-button>
                    </el-form-item>
                </el-form>

                <div class="d-flex mb-1" style="justify-content:space-between;">
                    <div>
                        <el-button type="info" plain size="small ">设置转出</el-button>
                        <el-button type="info" plain size="small ">取消转出</el-button>
                        <el-button type="info" plain size="small ">设置报废</el-button>
                        <el-button type="info" plain size="small ">取消报废</el-button>
                        <el-button type="info" plain size="small ">导出</el-button>
                    </div>
                    <div>
                        <el-button size="small ">列设置</el-button>
                    </div>
                </div>
            </div>
        </header>

        <main>
            <div style="height:650px;">
                <el-table :data="tableData" :default-sort="{ prop: 'date', order: 'descending' }" stripe border
                    max-height="580px">
                    <el-table-column prop="line" label="序号" width="80" sortable align="center" />
                    <el-table-column type="selection" width="75" align="center" />
                    <el-table-column prop="car" label="车牌号" width="175" align="center">
                        <template slot-scope="scope">
                            <span style="color: #4d4de2;cursor: pointer;"
                                @click="go(scope.row, 'http://jx.qida999.com/DriverCommon/driver/dr_car.html')">{{
                                    scope.row.car }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column prop="driver" label="司机" width="125" align="center" />
                    <el-table-column prop="spec" label="型号" width="125" align="center" />
                    <el-table-column prop="motor" label="发动机号" width="125" align="center" />
                    <el-table-column prop="frame" label="车架号" width="125" align="center" />
                    <el-table-column prop="buydate" label="登记日期" width="125" align="center" />
                    <el-table-column prop="validity" label="有效期" width="125" align="center" />
                    <el-table-column prop="YearCheck" label="年审到期" width="125" align="center" />
                    <el-table-column prop="driverYearCheck" label="行驶证到期" width="125" align="center" />
                    <el-table-column prop="" label="二级维护" width="125" align="center" />
                    <el-table-column prop="owner" label="车主名字" width="125" align="center" />
                    <el-table-column prop="company" label="车属单位" width="125" align="center" />
                    <el-table-column prop="registerDate" label="登记日期" width="125" align="center" />
                    <el-table-column prop="editer" label="修改人" width="125" align="center" />
                    <el-table-column prop="edittime" label="修改时间" width="175" align="center" />
                    <el-table-column prop="" label="季审到期" width="125" align="center" />
                    <el-table-column prop="ep" label="备注" width="125" align="center" />
                    <el-table-column label="操作" width="130">
                        <template slot-scope="scope">
                            <el-button size="mini" type="danger"
                                @click="handleDelete(scope.$index, scope.row)" class="el-icon-delete">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </main>


        <!-- 分页 -->
        <footer>
            <div class="pagin">
                <el-pagination background :current-page="initParams.page" :page-sizes="[20, 50, 100, 150]"
                    :page-size="initParams.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"
                    @size-change="handleSizeChange" @current-change="handleCurrentChange" />
            </div>
        </footer>
    </div>
</template>

<script>
import { invsetAPI } from '@/api/adminstare'
/**
* @author        Yng
* @time          2023-11-25 16:37:43  星期六
* @description   报废车辆信息
**/


export default {
    name: 'carScrap',
    data() {
        return {
            form: {
                name: '',
                region: ''
            },
            tableData: [],
            // 初始化参数
            initParams: {
                action: 'carList',
                carno: '',
                ep: '',
                page: 1,
                pageSize: 20,
                sortStr: '',
                delmark: '',
                frame: '',
            },
            total: 0
        }
    },
    mounted() {
        this.getScrap()
    },
    methods: {
        async getScrap() {
            let { code, data, total } = await invsetAPI(this.initParams)
            if (!code) {
                this.tableData = data
                this.total = total
            }
        },
        //  跳旧版详情
        go(val, URL) {
            const redirectUrl = `${URL}?car=${val.car}&aid=${this.$store.getters.userInfo.jxid}`
            const url = 'http://jx.qida999.com/DriverCommon/CommApiNew/login/Login.aspx'
            this.$oldLoginSystem(redirectUrl, url)
        },
        // 一页几条数据
        handleSizeChange(val) {
            this.initParams.pageSize = val
            this.getScrap()
        },
        // 当前页
        handleCurrentChange(val) {
            this.initParams.page = val
            this.getScrap()
        },
    }
}
</script>

<style lang="scss" scoped>
.btn {
    width: 98%;
    display: flex;
    justify-content: space-between;

    .right {}
}
</style>